body{
    font-family: Verdana,sans-serif;
    font-size: 12px;
}

#header{
	background-color: #CCCCCC;
	margin-bottom: 10px;
}

#main-menu{
	height: 30px;
	font-size: 14px;
	font-weight: bold;
}

#main-menu ul{
	line-height: 26px;
}

#main-menu li{
    float: left;
    list-style-type: none;
    margin-right: 50px;
    padding: 0;
}

#main-menu li a {
	text-decoration: none;
}

#main-menu li a:visited{
	color: black;
}

#gbox_tasks_list{
	margin: 0 auto;
}
#gbox_users_list{
	margin: 0 auto;
}

#gbox_projects_list{
	margin: 0 auto;
}

#gbox_list2{
	margin: 0 auto;
}

.link{
	padding: 5px;
	border: 1px solid #dddddd; 
	background: #FFFFFF;
}
.logout{
	padding: 5px;
	border: 1px solid #dddddd; 
	background: #FF4444;
}
.button2{
	font-size: 100%;
	bottom:200px;
	left:1000px;
}



.modal{
	margin-bottom:12px; 
	width:95%; 
	padding: .4em; 
	border:0; 
	margin-top:25px; 
	font-size: 80.5%;
	display:block;
}
.box{
	padding: 5px;
	background-color: #E0EEEE;
	color: #000000;
	line-height: 1.5em;
	border: 1px solid #E4E4E4;
}

.box label{
	float: left;
	width: 150px;
	text-align: right;
	margin-right: 5px;
}

.button1{
	position:relative;
	right:250px;
	margin:0 auto;width:50%;
}


.container_center{
	position:absolute;
	top:107px;
	right:360px;
	margin:0 auto;width:50%;
}
.container_left{
	float: left;
	width: 50%;
	
}

.container_right{
	float: right;
	width: 50%;
	position:relative;z-index:100
}
#effect { 
	width: 240px; 
	height: 135px; 
	padding: 0.4em; 
	position: relative; 
}
#effect h3 { 
	margin: 0; 
	padding: 0.4em; 
	text-align: center; 
}
.toggler { 
	width: 500px; 
	height: 200px; 
	position: relative; 
}
#button { 
	padding: .5em 1em; 
	text-decoration: none; 
}
.ContentFrame
{
    width: 400px; /* This is the size of area will actually display content */
    height:300px;
    overflow: hidden; /* To hide the big div */
}
.AllTabs
{
    width: 12000px; /* This should be the width  of TabContent * number of tab. */
    height: 250px;
    position:relative; /* Position should be relative so we could move it around */
    overflow: hidden;
}
.TabContent
{
    width: 400px; /* This is the side of each tab */
    height: 300px;
    float:left; /* make sure all tab will be in one single line */
}


.ui-autocomplete-loading { background: white url('../img/swirl.gif') right center no-repeat; }

input.file
{
   position: relative;
   text-align: left;
   -moz-opacity:0;
   filter:alpha(opacity: 0);
   opacity: 0;
   z-index: 2;
}
